<!--
 * @Description:
 * @Version: 0.1
 * @Autor: Civet
 * @Date: 2019-08-02 16:04:58
 * @LastEditors: Meow
 * @LastEditTime: 2019-11-14 16:02:30
 -->
<template>
  <my-el-menu :defaultActive="defaultActive"
              :isCollapse="getIsCollapse"
              :datas="datas"></my-el-menu>
</template>

<script type="text/ecmascript-6">
import myElMenu from '@/UIcomponents/myElementUI/myElMenu/MyElmenu';
import { mapGetters, mapActions } from 'Vuex';
import apiHome from "@/httpUtils/apiHome";

export default {
  name: 'LeftMenu',
  components: { myElMenu },
  props: {},
  data () {
    return {
      defaultActive: '', // 默认展开的项
      datas: [], // 列表的数据
      configMap: {},
      isCollapse: false
    };
  },
  methods: {
    ...mapActions(['setTabs']),
    setActivePath (path) {
      // 路径至匹配前三
      let pathArr = path.split("/");
      pathArr.length = 3;
      path = pathArr.join("/");
      this.defaultActive = path;
    }
  },
  watch: {
    $route (newV) {
      this.setActivePath(newV.path)
    }
  },
  computed: {
    ...mapGetters(['getIsCollapse'])
  },
  mounted () {
    apiHome.getLeftMenu().then(res => {
      this.datas = res.data.datas;
      this.setTabs(res.data.datas);
      // 设置默认展开的项
      this.setActivePath(this.$route.path)
    });
    // apiHome.getCheck({ id: 1 }).then(res => {
    //   console.log('!!!!!!测试', res)
    // })
  },
  destroyed () {
  }
};
</script>
<style scoped lang="less">
</style>
